<!--
 * @Author: zhangyang
 * @Date: 2022-03-03 18:55:31
 * @LastEditTime: 2022-08-13 17:02:02
 * @Description: 登录之后进入的页面
-->
<script lang="ts" setup>
import type { DisplayItem } from '@/components/YoungNumDisplay';
import { NTag } from 'naive-ui';

const displayData_1: DisplayItem[] = [
  {
    title: '访问数',
    tag: () => h(NTag, { size: 'small', type: 'success' }, {
      default: () => '月'
    }),
    num: 3000,
    icon: () => h('div', {
      class: 'i-twemoji:ten-oclock'
    }),
    sub_title: '总访问数',
    total_num: 36000
  },
  {
    title: '成交额',
    tag: () => h(NTag, { size: 'small', type: 'info' }, {
      default: () => '月'
    }),
    unit: '￥',
    num: 2000,
    icon: () => h('div', {
      class: 'i-twemoji:yen-banknote'
    }),
    sub_title: '总成交额',
    total_num: 52000
  },
  {
    title: '下载数',
    tag: () => h(NTag, { size: 'small', type: 'warning' }, {
      default: () => '周'
    }),
    num: 3000,
    icon: () => h('div', {
      class: 'i-twemoji:down-arrow'
    }),
    sub_title: '总下载数',
    total_num: 12000
  },
  {
    title: '成交数',
    tag: () => h(NTag, { size: 'small', color: { color: '#F9F0FF', borderColor: '#D3ADF7', textColor: '#5520AC' } }, {
      default: () => '年'
    }),
    num: 5200,
    icon: () => h('div', {
      class: 'i-twemoji:pancakes'
    }),
    sub_title: '总成交数',
    total_num: 52000
  }
];
</script>

<route lang="yaml">
meta:
  title: Dashboard
  authPath: 10000/1
  affix: true
</route>

<template>
  <div class="dashbord">
    <YoungNumDisplay :data="displayData_1" />
    <YoungNumDisplay :data="displayData_1" />
    <YoungNumDisplay :data="displayData_1" />
    <YoungNumDisplay :data="displayData_1" />
    <YoungNumDisplay :data="displayData_1" />
    <YoungNumDisplay :data="displayData_1" />
    <YoungNumDisplay :data="displayData_1" />
    <YoungNumDisplay :data="displayData_1" />
    <YoungNumDisplay :data="displayData_1" />
  </div>
</template>

<style lang="scss" scoped>
.dashbord {
  @apply p-2;
}
</style>